﻿
<div class="x-nav">
    <span class="layui-breadcrumb">
        <a><cite>首页</cite></a>
        <a><cite>轮播管理</cite></a>
        <a><cite>轮播列表</cite></a>
    </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新"><i class="layui-icon" style="line-height:30px">ဂ</i></a>
</div>

<form class="layui-form" onsubmit="return false" style="margin-top: 15px;">
    <div class="layui-form-item">
        <label class="layui-form-label">标题</label>
        <div class="layui-input-inline">
            <input type="text" id="title" class="layui-input" />
        </div>

        <button id="btnSearch" data-type="reload" class="layui-btn">搜索</button>
    </div>
</form>
<button class="layui-btn" id="created">新增轮播图</button>
<table id="my_table" lay-filter="mjf"></table>

@*<script type="text/html" id="top_tools">
    <button class="layui-btn" lay-event="create">新增轮播图</button>
</script>*@
<script type="text/html" id="inline_tool">
    <button class="layui-btn layui-btn-sm" lay-event="edit">编辑</button>
    <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="del">删除</button>
</script>
@*<script src="~/Admin/js/Date.js"></script>*@
<style>
    .layui-table-cell {
        text-align: center;
        display: table-cell;
        vertical-align: middle;
    }
</style>
@section Scripts{


    <script>
        //function dateToStr(date) {
        //    date.replace(/Date\([\d+]+\)/, function (a) { eval('d = new ' + a) });
        //    return d.format("yyyy-MM-dd hh:mm:ss");
        //}
        layui.use(['laydate', 'laypage', 'layer', 'table'], function () {
           var $ = layui.jquery;//jquery
            laydate = layui.laydate;//日期插件
            laypage = layui.laypage;//分页
            var  layer = layui.layer;//弹出层
            var table = layui.table;

            table.render({
                elem: '#my_table',
                url: '/Admin/Banner/List',
                method: "get",
                toolbar: '#top_tools',
                //heads: {
                //    'content-type': 'application/x-www-form-urlencoded'
                //},
                defaultToolbar: ['filter', 'exports', 'print', {
                    title: '提示',
                    layEvent: 'LAYTABLE_TIPS',
                    icon: 'layui-icon-tips'
                }],
                cols: [[{
                    type: 'checkbox'
                }, {
                    field: 'title',
                    title: '标题',
                }, {
                    field: 'imgUrl',
                    title: '图片地址'
                }, {
                    field: 'imgUrl',
                    title: '图片',
                    width: 120,
                    templet: '<div><img src="/{{d.ImgUrl}}"/></div>',
                }, {
                    field: 'toUrl',
                    title: '跳转地址',
                }, {
                    fixed: 'right',
                    title: '操作',
                    toolbar: "#inline_tool"
                }]],
                limits: [5, 10, 15, 20, 25, 50, 100],
                limit: 5,
                page: true,
                skin: 'line'
            });
            //var active = {
            //    reload: function () {
            //        table.reload('my_table', {
            //            where: {
            //                title: $("#title").val()
            //            }
            //        })
            //    }
            //};
            $("#btnSearch").click(function () {
                var title = $("#title").val();
                table.reload("my_table", {
                    where: {
                        title: title,
                    }
                });
                return false;
            });

            $("#created").click(function () {
                layer.open({
                    type: 2,
                    area: ['600px', '500px'],
                    content: 'Add' //这里content是一个普通的String
                });
            });
            //table.on('toolbar(mjf)', function (obj) {
            //    console.log(obj);
            //    if (obj.event == "create") {
            //        layer.open({
            //            type: 2,
            //            area: ['800px', '750px'],
            //            content: 'Add' //这里content是一个普通的String
            //        });
            //    }
            //});
            table.on('tool(mjf)', function (obj) {
                console.log(obj);
                var data = obj.data;
                console.log(data.id);
                if (obj.event == "edit") {
                    layer.open({
                        type: 2,
                        area: ['600px', '600px'],
                        content: 'Edit?Id=' + data.id
                    });
                } else if (obj.event == "del") {
                    layer.confirm("真的删除吗？", function (index) {
                        $.ajax({
                            url: "DelArt",
                            type: "post",
                            dataType: "json",
                            data: {
                                Id: data.id
                            },
                            success: function (res) {
                                if (res.success == true) {

                                    layer.close(index);

                                    location.reload();
                                } else {
                                    layer.msg(res.msg);
                                }
                            },
                            error: function (e) {
                                console.log(e);
                            }
                        })
                    });
                }
            });
        });


    </script>


    @*<script>
        function dateToStr(date) {
            date.replace(/Date\([\d+]+\)/, function (a) { eval('d = new ' + a) });
            return d.format("yyyy-MM-dd hh:mm:ss");
        }
        layui.use(['table'], function() {
          var table = layui.table;
          var $ = layui.$;
          var layer = layui.layer;
          table.render({
            elem: "#my_table",
              url: "List",
            method: "get",
            toolbar: "#top_tool",
            page: true,
            height: 650,
            cols: [[{
                type: 'checkbox'
            }, {
                field: 'Title',
                title: '标题',
            }, {
                field: 'ImgUrl',
                title: '图片地址'
            },{
                field: 'ImgUrl',
                title: '图片',
                width:120,
                templet: '<div><img src="/{{d.ImgUrl}}"/></div>',
            }, {
                field: 'ToUrl',
                title: '跳转地址',
            }, {
                fixed: 'right',
                title: '操作',
                toolbar: "#inline_tool"
            }]]
          });

          var active = {
            reload: function() {
              table.reload('my_table', {
                where: {
                    title: $("#title").val()
                }
              })
            }
          };
          $("#search").click(function() {

            var type = $(this).data('type');

            active[type] ? active[type].call(this) : '';
          });
          table.on('toolbar(mjf)', function(obj) {
            if(obj.event == "create") {
              layer.open({
                type: 2,
                area: ['600px', '600px'],
                content: 'Add'
              });
            }
          });
          table.on('tool(mjf)',function(obj){
            console.log(obj);

            var data=obj.data;
            if(obj.event=="edit"){
                layer.open({
                    type: 2,
                    area: ['600px', '600px'],
                    content: 'Edit?Id='+data.Id
                });
            }else if(obj.event=="del"){
              layer.confirm("真的删除吗？",function(index){
                  $.ajax({
                      url: "DelArt",
                      type: "post",
                      dataType: "json",
                      data: {
                          Id:data.Id
                      },
                      success: function (res) {
                          if (res.success == true) {

                              layer.close(index);

                              location.reload();
                          } else {
                              layer.msg(res.msg);
                          }
                      },
                      error: function (e) {
                          console.log(e);
                      }
                  })
              });
            }
          });

        });
        </script>*@
}


